<!--
*******************************************************************************
 * Copyright © 2017-2018 VMware, Inc. All Rights Reserved.
 *
 * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except
 * in compliance with the License. You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software distributed under the License
 * is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express
 * or implied. See the License for the specific language governing permissions and limitations under
 * the License.
 *
 * @author: Huaqiao Zhang, <huaqiaoz@vmware.com>
 *******************************************************************************
 -->
<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<title>Gateway Management</title>
	<link href="/css/gateway.css" rel="stylesheet">
</head>

<body>
	<div id="gateway_content_main">
		<div class="panel panel-success">
			<div class="panel-heading">
				<h3 class="panel-title">Gateway</h3>
			</div>
			<div class="panel panel-default" style="border:none;outline:none;margin:0;">
				<div class="panel-heading" style="padding:5px 2px;">
					<div id="gateway_button_group">
						<button type="button" class="btn btn-success" onclick="gatewayManagementModuleBtnGroup.add();">
							<i class="fa fa-plus" aria-hidden="true"></i>&nbsp;Add
						</button>
						<button type="button" class="btn btn-danger" onclick="gatewayManagementModuleBtnGroup.deleteOne();">
							<i class="fa fa-trash-o fa-lg" aria-hidden="true"></i>&nbsp;Delete
						</button>
						<button type="button" class="btn btn-warning" onclick="gatewayManagementModuleBtnGroup.refresh();">
							<i class="fa fa-refresh" aria-hidden="true"></i>&nbsp;Refresh
						</button>
					</div>
				</div>
			</div>

			<div class="panel-body" style="padding:0;">
				<div id="gateway_list">
					<table class="table table-responsive table-hover table-striped">
						<thead>
							<tr class="warning">
								<th></th>
								<th>#</th>
								<th>ID</th>
								<th>Gateway Name</th>
								<th>Description</th>
								<th>Address</th>
								<th>Created Time</th>
							</tr>
						</thead>
						<tbody>
						</tbody>
						<tfoot>
							<tr align="center">
								<td colspan=7>No Data.</td>
							</tr>
						</tfoot>
					</table>
				</div>
				<div id="current_gateway_intro">

				</div>
			</div>
		</div>


	</div>
	<div id="add_new_gateway">
		<form class="form-horizontal">
			<div class="form-group">
				<label for="name" class="col-sm-2 control-label">Name</label>
				<div class="col-sm-10">
					<input type="text" class="form-control" id="name" placeholder="gateway name">
				</div>
			</div>
			<div class="form-group">
				<label for="description" class="col-sm-2 control-label">Description</label>
				<div class="col-sm-10">
					<input type="text" class="form-control" id="description" placeholder="gateway description">
				</div>
			</div>
			<div class="form-group">
				<label for="address" class="col-sm-2 control-label">Address</label>
				<div class="col-sm-10">
					<input type="text" class="form-control" id="address" placeholder="100.100.100.100">
				</div>
			</div>
			<div class="form-group">
				<div class="col-sm-offset-2 col-sm-10">
					<button type="button" class="btn btn-success" onclick="gatewayManagementModuleBtnGroup.addNewGateway()">Submit</button>
					<button type="button" class="btn btn-success" onclick="gatewayManagementModuleBtnGroup.back()">Cancel</button>
				</div>
			</div>
		</form>
	</div>
</body>
<script src="/js/pages/gateway.js"></script>

</html>
